<template>
    <div class="app">
        <merchantHeader/>
        <div class="back">
            <div class="con">
              <div class="pxes"></div>
              <div class="listneo">
                <businessL/>
                <div class="conres">
                  <div class="ra"><h3>推广资金账户</h3> </div>
                  <div class="yuansdj">
                    <div class="data_q">
                      <div class="own">
                        <div class="oo_o">店铺保证金</div>
                        <div class="o_Oo">
                          <div><span>5000</span>元</div>
                          <div class="dnewdie">申请退款</div>
                        </div>
                      </div>
                      <div class="own">
                        <div class="oo_o">活动保证金 <p>(已冻结)</p></div>
                        <div class="o_Oo">
                          <div><span>5000</span>元</div>
                          <div class="dnewdie">提现</div>
                          
                        </div>
                      </div>
                    </div>
                  <div class="liebia">
                    <div class="whw_w">交易记录</div>
                    <el-tabs type="border-card">
                      <el-tab-pane label="店铺保证金">
                        <el-table
                          :data="tableData"
                          border
                          :header-cell-style="{background:'#D6DCE1',color:'#2D405E'}"
                          style="width: 100%">
                          <el-table-column
                            prop="date"
                            label="创建时间"
                        >
                          </el-table-column>
                          <el-table-column
                            prop="name"
                            label="交易单号"
                         >
                          </el-table-column>
                          <el-table-column
                            prop="province"
                            label="资金账户"
                          >
                          </el-table-column>
                          <el-table-column
                            prop="city"
                            label="业务类型"
                           >
                          </el-table-column>
                          <el-table-column
                            prop="address"
                            label="金额(元)"
                        >
                          </el-table-column>
                          <el-table-column
                            prop="zip"
                            label="对方账户"
                            >
                          </el-table-column>
                          <el-table-column
                            prop="zip"
                            label="交易状态"
                            >
                          </el-table-column>
                          <el-table-column
                            prop="zip"
                            label="完成时间"
                          >
                          </el-table-column>
                          <el-table-column
                            prop="zip"
                            label="备注"
                           >
                          </el-table-column>
                          <!-- <el-table-column
                            fixed="right"
                            label="操作"
                            width="100">
                            <template slot-scope="scope">
                              <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
                              <el-button type="text" size="small">编辑</el-button>
                            </template>
                          </el-table-column> -->
                        </el-table>
                   
                      </el-tab-pane>
                      <el-tab-pane label="活动保证金"></el-tab-pane>
                    </el-tabs>
                  </div>
                    <businessF/>
                  </div>
                  
                </div>
              </div>
              
            </div>
        </div>
        <Footer/>
    </div>
</template>
<script>
import merchantHeader from '@/components/merchantHeader'
import Footer from '@/components/Footer'
import businessL from '@/components/businessL'
import businessF from '@/components/businessF'
export default {
    components: { 
    merchantHeader,
    Footer,
    businessL,
    businessF
    },
    data() {
      return {
         tableData: [{
          date: '2016-05-02',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }]
      }
      
    },
    methods: {
    
    },
}
</script>
<style scoped>
.app  /deep/  .ist_l .ist_c li:nth-child(1) {
    background-color: #ff9381;
    width: 126px;
    height: 50px;
    display: block;
}


.back {
    background-color: #f06048
}  
.pxes {
  height: 15px;
}
.back .con {
  width: 1200px;
  margin: 0 auto;
  background-color: #eee;
  padding-bottom: 10px;
} 
.listneo {
  width: 1161px;
  margin: 0px auto;
  display: flex;
  justify-content: space-between;
}
.conres {
  width: 902px;
  border-radius: 6px;
  background-color: #fff
}
.conres .ra h3{
  font-size: 20px;
  color: #f06048;
  padding-left: 14px;
  border-bottom: 1px solid #cecece;
  margin-top: 15px;
  padding-bottom: 10px;
}
.data_q {
  display: flex
}
.data_q .own{
	width: 416px;
	height: 168px;
	background-color: #eeeeee;
	border-radius: 20px;
  margin-left: 22px;
  margin-top: 30px;
  margin-bottom: 50px;
}
.data_q .own {
  padding-left: 30px;
  line-height: 40px;
}
.data_q .own .oo_o {
  font-size: 20px;
  display: flex;
  margin-top: 20px;
}
.liebia {
  padding-left: 10px;
  padding-right: 10px;
} 
.liebia .whw_w {
  font-size: 18px;
  margin-left: 10px;
  margin-bottom: 10px;
}
.data_q .own .o_Oo {
  display: flex
}
.data_q .own .o_Oo span {
  font-size: 50px;
  color: #ff0000;
  margin-right: 5px;
  padding-top: 10px;
  display: inline-block
}
.data_q .own .o_Oo  .dnewdie {
	width: 80px;
	height: 26px;
	background-color: #a0a0a0;
	border-radius: 4px;
  color: #fff;
  text-align: center;
  line-height: 26px;
  margin-left: 140px;
  margin-top: 20px;
}
</style>